<!--
 * @Author: your name
 * @Date: 2022-01-10 10:45:12
 * @LastEditTime: 2022-11-08 10:52:11
 * @LastEditors: YanMeng
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \ias_ui\src\views\coi\commodityM\components\batchEdit.vue
-->

<template>
  <div>
    <el-dialog title="批量编辑" top="30vh" :visible.sync="dialogVisible" width="350px">
      <el-form ref="ruleForm" :model="form" :rules="rules" label-width="100px" size="mini" class="demo-ruleForm">
        <el-form-item prop="premiumPrice">
          <template slot="label">
            <el-checkbox v-model="checked" @change="rules.premiumPrice[0].required = checked" />
            <span style="margin-left: 27px">溢价</span>
          </template>
          <!-- <el-input v-model="form.premiumPrice" type="number" clearable placeholder="请输入溢价" style="width: 200px" /> -->
          <el-input-number v-model="form.premiumPrice" :precision="2" clearable placeholder="请输入溢价" style="width: 200px" :step="0.01" :min="1" :max="2" />
        </el-form-item>
        <el-form-item prop="area">
          <template slot="label">
            <el-checkbox v-model="checked2" @change="rules.area[0].required = checked2" />
            <span>存储方式</span>
          </template>
          <el-select v-model="form.area" style="width: 200px" placeholder="请选择存储方式" clearable>
            <el-option v-for="item in warmZoneLabel" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="dialogVisible = false">取 消</el-button>
        <el-button :loading="loading" type="primary" size="mini" @click="submitForm('ruleForm')">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { warmZoneLabel } from '@/views/coi/commonJs/dictionary'
export default {
  name: 'ReviewRemark',
  data() {
    return {
      warmZoneLabel,
      dialogVisible: false,
      loading: false,
      form: {},
      checked: false,
      checked2: false,
      rules: {
        area: [{ required: false, message: '请选择存储方式', trigger: 'change' }],
        premiumPrice: [{ required: false, message: '请输入溢价', trigger: 'blur' }]
      }
    }
  },
  methods: {
    submitForm(formName) {
      if (this.checked || this.checked2) {
        this.$refs[formName].validate((valid) => {
          if (valid && (this.form.premiumPrice || this.form.area)) {
            if (!this.checked) {
              delete this.form.premiumPrice
            }
            if (!this.checked2) {
              delete this.form.area
            }
            this.loading = true
            this.$emit('batchEditSubmit', this.form)
          } else {
            return false
          }
        })
      } else {
        this.$message({
          type: 'warning',
          message: '溢价和存储方式必填其一！'
        })
        return false
      }
    }
  }
}
</script>
